<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://lib.baomitu.com/vue/2.5.1/vue.js"></script>
</head>
<body>
	
	<div id="app">
		<input type="text" v-model="n1">
		<select v-model="opt">
			<option value="+">+</option>
			<option value="-">-</option>
			<option value="*">*</option>
			<option value="/">/</option>
		</select>
		<input type="text" v-model="n2">
		<input type="button" value="=" @click="cli">
		<input type="text" v-model="n3">
	</div>
	<script type="text/javascript">
		var vm=new Vue({
			el:'#app',
			data: {
				n1:null,
				n2:null,
				n3:null,
				opt:'+'
			},
			methods:{
				cli:function () {
					// switch (this.opt) {
					// 	case "+":
					// 		this.n3=parseInt(this.n1)+parseInt(this.n2);
					// 		break;
					// 	case "-":
					// 		this.n3=parseInt(this.n1)-parseInt(this.n2);
					// 		break;
					// 	case "*":
					// 		this.n3=parseInt(this.n1)*parseInt(this.n2);
					// 		break;
					// 	case "/":
					// 		this.n3=parseInt(this.n1)/parseInt(this.n2);
					// 		break;
					// }

					//注意：这是投机取巧方式，正是开发中尽量少用
					var codeStr = 'parseInt(this.n1)' + this.opt + 'parseInt(this.n2)';
					this.n3=eval(codeStr);
				}
			}
		})
	</script>
</body>
</html>